<template>
  <InlineLayout title-name="利息列表">
    <template #header>
      <my-form ref="queryFormRef" v-model:modelValue="queryParams" :model="queryParams" :items-datas="itemsDatas">
        <my-button type="reset" title="重置" @click="resetQuery" />
        <my-button type="search" title="查询" :loading="loading" @click="handleQuery" />
      </my-form>
    </template>

    <!-- <template #titleTools>
      <my-button type="export" title="导出" @click="openClick" />
    </template> -->

    <my-table :columns="columns" :table-data="tableData" style="height: auto" />
    <pagination v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" :total="total" @pagination="getList" />
  </InlineLayout>
</template>

<script setup lang="ts">
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { listAb06 } from '@/api/yuanshidian/ab06/index';
const loading = ref(true);
const total = ref(0);

const queryFormRef = ref<ElFormInstance>();
const examinedataFormRef = ref<ElFormInstance>();

const state = reactive({
  title: '',
  queryParams: {
    pageNum: 1,
    pageSize: 10
  },
  itemsDatas: [
    { label: '单位编码', prop: 'dw01', type: 'input' },
    { label: '单位名称', prop: 'dw02', type: 'input' },
    { label: '姓名', prop: 'gr04', type: 'input' },
    { label: '证件号码', prop: 'gr02', type: 'input' }
  ],
  tableData: [],
  columns: [
    { label: '序号', type: 'index', width: '55', prop: 'index' },
    { label: '统筹区编码', prop: 'aaa027', align: 'center' },
    { label: '单位编码', prop: 'dw01', align: 'center' },
    { label: '单位名称', prop: 'dw02', align: 'center' },
    { label: '姓名', prop: 'gr04', align: 'center' },
    { label: '身份证号码', prop: 'gr02', align: 'center' },
    { label: '个人账号', prop: 'gr03', align: 'center' },
    { label: '计息年度', prop: 'grjx01', align: 'center' },
    { label: '本期个人缴费利息', prop: 'grjx02', align: 'center' },
    { label: '本期单位缴费利息', prop: 'grjx03', align: 'center' },
    { label: '本期单位代缴利息', prop: 'grjx04', align: 'center' },
    { label: '历年个人缴费利息', prop: 'grjx05', align: 'center' },
    { label: '历年单位缴费利息', prop: 'grjx06', align: 'center' },
    { label: '历年单位代缴利息', prop: 'grjx07', align: 'center' },
    { label: '新政策个人缴费利息', prop: 'grjx22', align: 'center' },
    { label: '新政策单位缴费利息', prop: 'grjx23', align: 'center' },
    { label: '新政策单位代缴利息', prop: 'grjx24', align: 'center' }
  ]
});
const { itemsDatas, tableData, columns, queryParams } = toRefs(state);

/** 查询审核列表列表 */
const getList = async () => {
  loading.value = true;
  const res = await listAb06(queryParams.value);
  tableData.value = res.rows;
  total.value = res.total;
  loading.value = false;
};

/** 搜索按钮操作 */
const handleQuery = () => {
  queryParams.value.pageNum = 1;
  getList();
};

/** 重置按钮操作 */
const resetQuery = () => {
  queryFormRef.value?.resetFields();
  handleQuery();
};

onMounted(() => {
  getList();
});
</script>
